import { createBrowserRouter } from 'react-router-dom';
import Login from '../pages/Login';
import Home from '../pages/Home';
import Dashboard from '../pages/Dashboard';
import Users from '../pages/Users';
import List from "../pages/List"
import NotFount from "../pages/NotFount"
import Erlogin from '../pages/Erlogin';
/**
 * 路由模式常用的有两种，hash history
 * createBrowserRouter：
 *  用于创建history模式的路由
 * createHashRouter：
 *  用于创建hash模式的路由
 * hash模式：
 *  路由路径中包含#号，如：http://localhost:3000/#/home
 *  刷新页面不会导致404错误
 *  浏览器会将#号后面的内容作为路由路径，不会发送给服务器
 * history模式：
 *  路由路径中不包含#号，如：http://localhost:3000/list
 *  刷新页面会导致404错误，需要服务器端配置支持
 *  浏览器会将完整的路由路径发送给服务器，服务器需要配置支持
 *  服务器配置无论你传给我什么的路径，我都是返回index.html
 *  可以在nginx里面配置这一行代码
 *   try_files $uri $uri/ /index.html;
 *  服务器会先去查找你传递过来的这个路径下面的资源,
 *  如果有的话就进行返回对应的资源，如果没有就返回index.html
 */
const router = createBrowserRouter([
  {
    path: '/',
    element: <Login />,
  },
  {
    path: '/login',
    element: <Login />,
  },
  {
    path: '/home',
    element: <Home />,
    children: [
      {
        index: true,
        element: <Dashboard />,
      },
      {
        path: 'dashboard',
        element: <Dashboard />
      },
      {
       path:'erlogin',
       element:<Erlogin/>
      },
      {
        path: 'users',
        element: <Users />,
        children:[
          {
            path:'list',
            element:<List/>
          }
        ]
      }
    ],
  },
  {
    path:"*",
    element:<NotFount/>
  }
]);

export default router;
